<template>
	<view>
		<view v-if="isCheak==1" class="" style="position: absolute;top: -140rpx;">
			<image style="width:750rpx;height: 1624rpx;" src="https://emos-lei.oss-cn-beijing.aliyuncs.com/v2/img/bancai.png" mode="widthFix"></image>
		</view>
		<view v-else-if="isCheak==2" class="" style="position: absolute;top: -140rpx;">
			<image style="width:750rpx;height: 1624rpx;" src="https://emos-lei.oss-cn-beijing.aliyuncs.com/v2/img/banzhuan.png" mode="widthFix"></image>
		</view>
		<view v-else class="" style="position: absolute;top: -140rpx;">
			<image style="width:750rpx;height: 1624rpx;" src="https://emos-lei.oss-cn-beijing.aliyuncs.com/v2/img/bg-enact.png" mode="widthFix"></image>
		</view>
		<!-- 顶部  -->
		<view class="m-h1" style="text-align: center;">
			定制
		</view>
		
		
		<view  style="position: relative;top:100rpx;">
			<!-- 导航 -->
			<view class="e-nav">
			
				<view @tap="isCheak=1" :class="[isCheak=='1'?'e-nav-item-active':'e-nav-item']"  >
					<text :class="[isCheak=='1'?'nav-name-font-active':'nav-name-font']">板材</text>
				</view>
				<view @tap="isCheak=2" :class="[isCheak=='2'?'e-nav-item-active':'e-nav-item']"  >
					<text :class="[isCheak=='2'?'nav-name-font-active':'nav-name-font']">砌块</text>
				</view>
				<view @tap="isCheak=3" :class="[isCheak=='3'?'e-nav-item-active':'e-nav-item']"  >
					<text :class="[isCheak=='3'?'nav-name-font-active':'nav-name-font']">辅材</text>
				</view>
				<view @tap="isCheak=4" :class="[isCheak=='4'?'e-nav-item-active':'e-nav-item']"  >
					<text :class="[isCheak=='4'?'nav-name-font-active':'nav-name-font']">配件</text>
				</view>
				<view @tap="isCheak=5" :class="[isCheak=='5'?'e-nav-item-active':'e-nav-item']"  >
					<text :class="[isCheak=='5'?'nav-name-font-active':'nav-name-font']">工具</text>
				</view>
			</view>
		
		
			<!-- body -->
			
			<view v-if="isCheak=='1'" class="e-but-top" style="width: 750rpx; display: flex;justify-content: center;">
				<view class="e-btn">
					<view class="" style="display: flex;justify-content: center;" @tap="toCheck1()">
							<view class="e-btn-font" style="margin-top: 20rpx;"> 定制板材</view>
					</view>
				</view>
			</view>
			
			<view v-if="isCheak=='2'" class="e-but-top" style="width: 750rpx; display: flex;justify-content: center;">
				<view class="e-btn">
					<view class="" style="display: flex;justify-content: center;" @tap="toEnactOne()">
							<view class="e-btn-font" style="margin-top: 20rpx;">定制砌块</view>
					</view>
				</view>
			</view>
			
			<view v-if="isCheak=='3'" class="e-but-top" style="width: 750rpx; display: flex;justify-content: center;">
				<view class="e-btn">
					<view class="" style="display: flex;justify-content: center;" @tap="toEnactOne()">
							<view class="e-btn-font" style="margin-top: 20rpx;">定制辅材</view>
					</view>
				</view>
			</view>
			
			<view v-if="isCheak=='4'" class="e-but-top" style="width: 750rpx; display: flex;justify-content: center;">
				<view class="e-btn">
					<view class="" style="display: flex;justify-content: center;" @tap="toEnactOne()">
							<view class="e-btn-font" style="margin-top: 20rpx;">定制配件</view>
					</view>
				</view>
			</view>
			
			<view v-if="isCheak=='5'" class="e-but-top" style="width: 750rpx; display: flex;justify-content: center;">
				<view class="e-btn">
					<view class="" style="display: flex;justify-content: center;" @tap="toEnactOne()">
							<view class="e-btn-font" style="margin-top: 20rpx;">定制工具</view>
					</view>
				</view>
			</view>
			
			
			
			
			
			<!-- 底部 -->
			<view class="" style="display: flex;justify-content: center;margin-top: 32rpx;margin-bottom: 36rpx;">
				<view :class="[isCheak=='1'?'e-item-ative':'e-item']"></view>
				<view :class="[isCheak=='2'?'e-item-ative':'e-item']"></view>
				<view :class="[isCheak=='3'?'e-item-ative':'e-item']"></view>
				<view :class="[isCheak=='4'?'e-item-ative':'e-item']"></view>
				<view :class="[isCheak=='5'?'e-item-ative':'e-item']"></view>
			</view>
		</view>
		
	</view>
</template>
 
<script>
	export default {
		data() {
			return {
				isCheak:2,
			}
		},
		methods: {
			toEnactOne:function(){
				uni.navigateTo({
					url:'../enact-1/enact-1'
				})
			},
			toCheck1:function(){
				uni.navigateTo({
					url:'../panel-1/panel-1'
				})
			}
		}
	}
</script>

<style scoped lang="less">
@import url("enact.less");
@import url("../../style.less");
</style>
